<html>
	<head>
		<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<script src="jquery-1.8.2.js" type="text/javascript"></script>
		<script src="validation_cn.js" type="text/javascript"></script>
		<link rel="stylesheet" type="text/css" href="style_min.css" />
		<style type="text/css">
			body td {
				color: #333;
				font-family: Arial, Helvetica, sans-serif;
				font-size: 14pt;
			}
			.validation-advice {
				margin: 0px 0;
				padding: 0px;
				margin-left: 10px;
				color : #FF3300;
				font-weight: bold;
				display: inline;
			}
			.td-width {
				width:10%;
			}
			pre { font-family: monospace; color: #ffffff; background-color: #333; font-size:1.2em}
			body { font-family: monospace; font-size:1.2em }
			.lnr { color: #888888; background-color: #323232; }
			.Special { color: #ffa500; }
			.String { color: #00d42d; }
			.Constant { color: #cafe1e; }
			.Statement { color: #ffff60; font-weight: bold; }
			.Function { color: #ff5600; }
			.Type { color: #84a7c1; font-weight: bold; }
			.Comment { color: #aeaeae; }
		</style>
		<script type="text/javascript">
			function test(){
		   		var f = $(document.forms[0]); 
				f.submit();
			}
		</script>
	</head>
	<body>

		<form action="#" enctype="multipart/form-data" id='example-form' onsubmit="return false;">
			<table style="width:80%">
				<tr> 
					<td>required</td>
					<td>非空</td>
					<td><input type="text" name="textfield" class="required"></td>
					<tr/>
						<tr>
							<td colspan="3"><pre>
[<span class="String">'required'</span>, <span class="Function">function</span>(v) {
	<span class="Statement">return</span> !((v == <span class="Type">null</span>) || (v.length == <span class="Constant">0</span>) || <span class="String">/^[</span><span class="Special">\s</span><span class="String">|</span><span class="Special">\u3000</span><span class="String">]+$/</span>.test(v));
},{<span class="Statement">ignoreEmptyValue</span>:<span class="Constant">false</span>}]
</pre></td>
						</tr>
						<tr> 
							<td>validate-selection</td>
							<td>必选</td>
							<td>
								<select name="select" class="validate-selection">
									<option value=" ">Please Select</option>
									<option value="f">f</option>
									<option value="m">m</option>
								</select> 
							</td>
						</tr>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-selection'</span>, <span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> elm.options ? elm.selectedIndex &gt; <span class="Statement">0</span> : !((v == <span class="Type">null</span>) || (v.length == <span class="Constant">0</span>));
}]						
						</pre>
					</td>
				</tr>
						<tr> 
							<td>validate-number</td>
							<td>数字</td>
							<td><input type="text" name="textfield2" class="validate-number"></td>
						</tr>
						<tr>
							<td colspan="3">
								<pre>
[<span class="String">'validate-number'</span>, <span class="Function">function</span>(v) {
	<span class="Statement">return</span> (!isNaN(v) &amp;&amp; !<span class="String">/^</span><span class="Special">\s</span><span class="String">+$/</span>.test(v));
}]
						</pre>
							</td>
						</tr>
						<tr> 
							<td>validate-digits</td>
							<td>输入的每一个字符必须为数字</td>
							<td><input type="text" name="textfield3" class="validate-digits"></td>
						</tr>
						<tr>
							<td colspan="3">
								<pre>
[<span class="String">'validate-digits'</span>, <span class="Function">function</span>(v) {
	<span class="Statement">return</span> !<span class="String">/[^</span><span class="Special">\d</span><span class="String">]/</span>.test(v);
}]
						</pre>
							</td>
						</tr>
						<tr> 
							<td>validate-alpha</td>
							<td>英文字母</td>
							<td><input type="text" name="textfield4" class="validate-alpha"></td>
						</tr>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-alpha'</span>,<span class="String">/^[a-zA-Z]+$/</span>]
						</pre>
					</td>
				</tr>
						<tr> 
							<td>validate-alphanum</td>
							<td>英文字母或数字</td>
							<td><input type="text" name="textfield5" class="validate-alphanum"></td>
						</tr>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-alphanum'</span>, <span class="Function">function</span>(v) {
	<span class="Statement">return</span> !<span class="String">/</span><span class="Special">\W</span><span class="String">/</span>.test(v)
}]
						</pre>
					</td>
				</tr>
						<tr> 
							<td>validate-email</td>
							<td>电子邮件</td>
							<td><input type="text" name="textfield6" class="validate-email"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-email'</span>,<span class="String">/</span><span class="Special">\w</span><span class="String">{1,}[@][</span><span class="Special">\w\-</span><span class="String">]{1,}([.]([</span><span class="Special">\w\-</span><span class="String">]{1,})){1,3}$/</span>]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-url</td>
							<td>URL</td>
							<td><input type="text" name="textfield7" class="validate-url"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-url'</span>,<span class="String">/^(http|https|ftp):</span><span class="Special">\/\/</span><span class="String">(([A-Z0-9][A-Z0-9_-]*)(</span><span class="Special">\.</span><span class="String">[A-Z0-9][A-Z0-9_-]*)+)(:(</span><span class="Special">\d</span><span class="String">+))?</span><span class="Special">\/</span><span class="String">?/i</span>]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-one-required</td>
							<td>男<input type="radio" name="radiobutton" value="f" class="validate-one-required">女<input type="radio" name="radiobutton" value="m"> 
							</td>
						</tr>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-one-required'</span>, <span class="Function">function</span> (v,elm) {
	<span class="Type">var</span> p = elm.parentNode;
	<span class="Type">var</span> options = p.getElementsByTagName(<span class="String">'INPUT'</span>);
	<span class="Statement">return</span> $A(options).any(<span class="Function">function</span>(elm) {
		<span class="Statement">return</span> $F(elm);
	});
},{<span class="Statement">ignoreEmptyValue</span> : <span class="Constant">false</span>}]
						</pre>
					</td>
				</tr>
						<tr> 
							<td>validate-integer</td>
							<td>整数</td>
							<td><input type="text" name="textfield8" class="validate-integer"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-integer'</span>,<span class="String">/^[-+]?[1-9]</span><span class="Special">\d</span><span class="String">*$|^0$/</span>]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-pattern-/^\d*$/</td>
							<td>正则表达式</td>
							<td><input type="text" name="textfield9" class="validate-pattern-/^\d*$/" value="must be number"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-pattern'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> eval(<span class="String">'('</span>+args.singleArgument+<span class="String">'.test(v))'</span>);
}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-ip</td>
							<td>ip地址</td>
							<td><input type="text" name="textfield10" class="validate-ip"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-ip'</span>,<span class="String">/^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)</span><span class="Special">\.</span><span class="String">){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/</span>]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>min-value-10</td>
							<td>最小值</td>
							<td><input type="text" name="textfield11" class="min-value-10" value="9"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'min-value'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> parseFloat(v) &gt;= parseFloat(args[<span class="Constant">0</span>]);
},{<span class="Statement">depends</span> : [<span class="String">'validate-number'</span>]}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>max-value--10</td>
							<td>最大值</td>
							<td><input type="text" name="textfield12" class="max-value--10"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'max-value'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> parseFloat(v) &lt;= parseFloat(args[<span class="Constant">0</span>]);
},{<span class="Statement">depends</span> : [<span class="String">'validate-number'</span>]}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>min-length-2</td>
							<td>最小长度</td>
							<td><input type="text" name="textfield13" class="min-length-2" value="1"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'min-length'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> v.length &gt;= parseInt(args[<span class="Constant">0</span>]);
}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>max-length-5</td>
							<td>最大长度</td>
							<td><input type="text" name="textfield14" class="max-length-5"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'max-length'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> v.length &lt;= parseInt(args[<span class="Constant">0</span>]);
}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>int-range-1-5</td>
							<td>整数范围</td>
							<td><input type="text" name="textfield15" class="int-range-1-5"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'int-range'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> (parseInt(v) &gt;= parseInt(args[<span class="Constant">0</span>]) &amp;&amp; parseInt(v) &lt;= parseInt(args[<span class="Constant">1</span>]))
},{<span class="Statement">depends</span> : [<span class="String">'validate-integer'</span>]}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>float-range--1.1-10</td>
							<td>浮点数范围</td>
							<td><input type="text" name="textfield16" class="float-range--1.1-10" value="-1.2"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'float-range'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	 <span class="Statement">return</span> (parseFloat(v) &gt;= parseFloat(args[<span class="Constant">0</span>]) &amp;&amp; parseFloat(v) &lt;= parseFloat(args[<span class="Constant">1</span>]))
},{<span class="Statement">depends</span> : [<span class="String">'validate-number'</span>]}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>length-range-5-8</td>
							<td>长度范围</td>
							<td><input type="text" name="textfield17" class="length-range-5-8"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'length-range'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> (v.length &gt;= parseInt(args[<span class="Constant">0</span>]) &amp;&amp; v.length &lt;= parseInt(args[<span class="Constant">1</span>]))
}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>equals-password</td>
							<td>密码一致</td>
							<td>
								<input type="password" name="password" id="password" value="a">(id=password)<br> 
								<input type="password" name="confirmPassword" class="equals-password"> 
							</td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'equals'</span>, <span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> $F(args[<span class="Constant">0</span>]) == v;
},{<span class="Statement">ignoreEmptyValue</span>:<span class="Constant">false</span>}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>less-than-value1</td>
							<td>小于id为value1的元素的值</td>
							<td>
								<input type="text" name="value1" id="value1" value="1">(id=value1)<br> 
								<input type="text" name="textfield21" class="less-than-value1">
							</td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'less-than'</span>, <span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">if</span>(Validation.get(<span class="String">'validate-number'</span>).test(v) &amp;&amp; Validation.get(<span class="String">'validate-number'</span>).test($F(args[<span class="Constant">0</span>])))
            <span class="Statement">return</span> parseFloat(v) &lt; parseFloat($F(args[<span class="Constant">0</span>]));
        <span class="Statement">return</span> v &lt; $F(args[<span class="Constant">0</span>]);
}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>great-than-beginDate</td>
							<td>晚于开始日期</td>
							<td>
								开始日期:<input type="text" name="beginDate" id="beginDate" value="2005-10-10" class="validate-date">(id=beginDate)<br> 
								结束日期:<input type="text" name="textfield23" value="2005-10-09" class="validate-date great-than-beginDate">
							</td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'great-than'</span>, <span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">if</span>(Validation.get(<span class="String">'validate-number'</span>).test(v) &amp;&amp; Validation.get(<span class="String">'validate-number'</span>).test($F(args[<span class="Constant">0</span>])))
		 <span class="Statement">return</span> parseFloat(v) &gt; parseFloat($F(args[<span class="Constant">0</span>]));
	<span class="Statement">return</span> v &gt; $F(args[<span class="Constant">0</span>]);
}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-date-yyyy年MM月dd日</td>
							<td>日期校验</td>
							<td><input type="text" name="textfield24" class="validate-date-yyyy年MM月dd日" value="2006年02月29日"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-date'</span>, <span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Type">var</span> dateFormat = args.singleArgument || <span class="String">'yyyy-MM-dd'</span>;
	metadata._error = ValidationUtils.format(ValidationUtils.getI18nMsg(metadata.className),
		[dateFormat,dateFormat.replace(<span class="String">'yyyy'</span>,<span class="String">'2006'</span>).replace(<span class="String">'MM'</span>,<span class="String">'03'</span>).replace(<span class="String">'dd'</span>,<span class="String">'12'</span>)]);
	<span class="Statement">return</span> ValidationUtils.isDate(v,dateFormat);
}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-file-png-jpg</td>
							<td>文件类型验证</td>
							<td><input type="file" name="file" class="validate-file-png-jpg"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-file'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">return</span> $A(args).any(<span class="Function">function</span>(extentionName) {
		<span class="Statement">return</span> <span class="Statement">new</span> <span class="Special">RegExp</span>(<span class="String">'</span><span class="Special">\\</span><span class="String">.'</span>+extentionName+<span class="String">'$'</span>,<span class="String">'i'</span>).test(v);
	});
}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-id-number</td>
							<td>身份证号码</td>
							<td><input type="text" name="textfield25" class="validate-id-number"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-id-number'</span>,<span class="Function">function</span>(v,elm,args,metadata) {
	<span class="Statement">if</span>(!(<span class="String">/^</span><span class="Special">\d</span><span class="String">{17}(</span><span class="Special">\d</span><span class="String">|x)$/i</span>.test(v) || <span class="String">/^</span><span class="Special">\d</span><span class="String">{15}$/i</span>.test(v))) <span class="Statement">return</span> <span class="Constant">false</span>;
	<span class="Type">var</span> provinceCode = parseInt(v.substr(<span class="Constant">0</span>,<span class="Constant">2</span>));
	<span class="Statement">if</span>((provinceCode &lt; <span class="Constant">11</span>) || (provinceCode &gt; <span class="Constant">91</span>)) <span class="Statement">return</span> <span class="Constant">false</span>;
	<span class="Type">var</span> forTestDate = v.length == <span class="Constant">18</span> ? v : v.substr(<span class="Constant">0</span>,<span class="Constant">6</span>)+<span class="String">&quot;19&quot;</span>+v.substr(<span class="Constant">6</span>,<span class="Constant">15</span>);
	<span class="Type">var</span> birthday = forTestDate.substr(<span class="Constant">6</span>,<span class="Constant">8</span>);
	<span class="Statement">if</span>(!ValidationUtils.isDate(birthday,<span class="String">'yyyyMMdd'</span>)) <span class="Statement">return</span> <span class="Constant">false</span>;
	<span class="Statement">if</span>(v.length == <span class="Constant">18</span>) {
		v = v.replace(<span class="String">/x$/i</span>,<span class="String">&quot;a&quot;</span>);
		<span class="Type">var</span> verifyCode = <span class="Constant">0</span>;
		<span class="Statement">for</span>(<span class="Type">var</span> i = <span class="Constant">17</span>;i &gt;= <span class="Constant">0</span>;i--)
			verifyCode += (<span class="Special">Math</span>.pow(<span class="Constant">2</span>,i) % <span class="Constant">11</span>) * parseInt(v.charAt(<span class="Constant">17</span> - i),<span class="Constant">11</span>);
		<span class="Statement">if</span>(verifyCode % <span class="Constant">11</span> != <span class="Constant">1</span>) <span class="Statement">return</span> <span class="Constant">false</span>;
	}
	<span class="Statement">return</span> <span class="Constant">true</span>;
}]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-chinese</td>
							<td>中文</td>
							<td><input type="text" name="textfield26" class="validate-chinese"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-chinese'</span>,<span class="String">/^[</span><span class="Special">\u4e00</span><span class="String">-</span><span class="Special">\u9fa5</span><span class="String">]+$/</span>]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-phone</td>
							<td>电话</td>
							<td><input type="text" name="textfield27" class="validate-phone"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-phone'</span>,<span class="String">/^((0[1-9]{3})?(0[12][0-9])?[-])?</span><span class="Special">\d</span><span class="String">{6,8}$/</span>]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-mobile-phone</td>
							<td>手机号码</td>
							<td><input type="text" name="textfield28" class="validate-mobile-phone"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-mobile-phone'</span>,<span class="String">/(^0?[1][358][0-9]{9}$)/</span>]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-zip</td>
							<td>邮编</td>
							<td><input type="text" name="textfield29" class="validate-zip"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-zip'</span>,<span class="String">/^[1-9]</span><span class="Special">\d</span><span class="String">{5}$/</span>]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td>validate-qq</td>
							<td>qq号码</td>
							<td><input type="text" name="textfield30" class="validate-qq"></td>
				<tr>
					<td colspan="3">
						<pre>
[<span class="String">'validate-qq'</span>,<span class="String">/^[1-9]</span><span class="Special">\d</span><span class="String">{4,8}$/</span>]
						</pre>
					</td>
				</tr>
						</tr>
						<tr> 
							<td colspan="2"> 
								<div align="center"> 
									<input type="button" onclick="test()" name="Submit" value="提交">&nbsp;&nbsp;&nbsp;
									<input type="reset" name="Submit2" value="重置">
								</div>
							</td>
						</tr>
					</table>

				</form>
				<script>
					var validate = new Validation(document.forms[0],{immediate:true});
					// var validate = new Validation("example-form",{immediate:true});
					// var validate = new Validation($("example-form"),{immediate:true});
				</script>

			</body>
		</html>
